<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%--
	版权声明： Copyright &copy; 2008-2009  
	作者：李数
	最后修改时间：2008-8-20 上午10:43:16
--%>
<!DOCTYPE html>
<html>
  <head>
    <title>用户列表</title>
	<link rel="stylesheet" type="text/css" href="../jslib/jquery-easyui-1.4.1/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../jslib/jquery-easyui-1.4.1/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../jslib/jquery-easyui-1.4.1/demo/demo.css">
	<script type="text/javascript" src="../jslib/jquery-easyui-1.4.1/jquery.min.js"></script>
	<script type="text/javascript" src="../jslib/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../jslib/jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript">
	$(function(){
		$.messager.progress({ 
		    title: '请等待', 
		    msg: '', 
		    text: '数据加载中.......' 
		});
		//$('#tt').tree({cascadeCheck:true});
	});
	 
	function getChecked(){
		var nodes = $('#tt').tree('getChecked');
		var ids = '';
		for(var i=0; i<nodes.length; i++){
			 ids += nodes[i].id+","
		}
		return ids;
	}
	function onLoadSuccess(node, data){
		  $.messager.progress('close'); 
	}
	function rowformater(value,row,index)
	 {
	 	return  ' <image onclick="showDetail('+row.moduleId+')" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/note_edit.png" title="修改"/>' +
	 			' <image onclick="deleteModule('+row.moduleId+')" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/note_delete.png" title="删除"/>';
	 }
	function rowformaterbutton(value,row,index)
	 {
	 	return  ' <image onclick="showDetailButton('+row.buttonId+')" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/note_edit.png" title="修改"/>' +
	 			' <image onclick="deleteModuleButton('+row.buttonId+')" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/note_delete.png" title="删除"/>';
	 }
	function clickrow(row){  
        gridRefreshButton();
	}
	function collapseAll(){
		$('#tt').tree('collapseAll');
	}
	function expandAll(){
		$('#tt').tree('expandAll');
	}
	function collapse(){
		var node = $('#tt').tree('getSelected');
		$('#tt').tree('collapse',node.target);
	}
	function expand(){
		var node = $('#tt').tree('getSelected');
		$('#tt').tree('expand',node.target);
	}

	function append(){
		var t = $('#tt');
		var node = t.tree('getSelected');
		$('#fatherModuleId').val(node.id);//设置是添加
		$('#flag').val('1');//设置是添加
		$("#btndiv").show();
		$('#add').dialog('open');
	}
	function updateit(){
		var node = $('#tt').tree('getSelected'); 
		if(node.id==1){
			alert("根节点不允许修改");
			return false;
		}
		$('#flag').val('2');//设置是修改
		$("#btndiv").show();
		$('#add').dialog('open');
		$('#ff').form('load', '${pageContext.request.contextPath}/menu!gotoUpdate.action?menuId='+node.id+'&temp='+Math.round(Math.random()*10000));
	}
	function removeit(){
		var node = $('#tt').tree('getSelected');
		if(node.id==1){
			alert("根节点不允许删除");
			return false;
		}
		var isLeaf = $('#tt').tree('isLeaf',node.target);
		if(!isLeaf){
			alert("请先删除下属子节点。");
			return false;
		}
		if(!confirm("是否确认删除 ？")){
			   return false;
			}
			var params = {  
				"menuId": node.id
			};  
			var actionUrl = "${pageContext.request.contextPath}/menu!delete.action"; 
		    $.ajax({  
		        url : actionUrl,  
		        type : "post", 
		        data : params,  
		        dataType : "json",  
		        cache : false,  
				error : function(textStatus, errorThrown) {  
					alert("系统ajax交互错误: " + textStatus.value);  
				},  
				success : function(data, textStatus) {  
					if(data.result=='success'){
						alert('删除成功！');
						$('#tt').tree('remove', node.target);
					}else{
						alert('删除失败！');
					}
				}
			});
		
	}
	function clickrow(node){  
        gridRefreshButton(node.id);
	}
	function gridRefreshButton(menuid){
        //重新加载datagrid的数据  
        var queryParams = $('#button').datagrid('options').queryParams;  
        queryParams.menuId = menuid;  
        $('#button').datagrid('options').queryParams=queryParams;   
		$('#button').datagrid('options').url="${pageContext.request.contextPath}/menu!queryMenuButton.action";  
        $("#button").datagrid('reload');  
	}
	 
	function submitForm(){
		var flag = $('#flag').val();
		var url = "";
		if(flag == 1){
			url = '${pageContext.request.contextPath}/menu!saveMenu.action';
		}else if(flag==2){
			url = '${pageContext.request.contextPath}/menu!edit.action';
		}
		$('#ff').form('submit',{
			onSubmit:function(){
				return $(this).form('enableValidation').form('validate');
			},
			url : url,
	        dataType : 'text',
	        success : function(result) { 
	        	var data = $.parseJSON(result); 
	        	if(data.result=='success'){
	        		alert("保存成功！");
	        		$('#add').dialog('close');  
	        		var t = $('#tt');
	        		var node = t.tree('getSelected');
	        		t.tree('append', {
	        				parent: (node?node.target:null),
	        				data: [{
	        					id : data.id,
	        					text: data.menuname
	        				}]
	        			});
	        	}else if(data.result=='update'){
	        		alert("保存成功！");
	        		$('#add').dialog('close');  
	        		var t = $('#tt');
	        		var node = t.tree('getSelected');
	        		t.tree('update', {
	        			target: (node?node.target:null),
	        			text: data.menuname
					});
	        	}else if(data.result=='error'){
	        		alert("保存失败！");
	        	}
	        }  
		});
	}
	function onDrop(target, source, point){
		var targetId = $('#tt').tree('getNode', target).id; 
		var params = {  
				"targetId": targetId,
				"sourceId": source.id,
				"point": point
			};  
			var actionUrl = "${pageContext.request.contextPath}/menu!onSort.action"; 
		    $.ajax({  
		        url : actionUrl,  
		        type : "post", 
		        data : params,  
		        dataType : "json",  
		        cache : false,  
				error : function(textStatus, errorThrown) {  
					alert("系统ajax交互错误: " + textStatus.value);  
				},  
				success : function(data, textStatus) {  
					if(data.result=='success'){
						
						//$('#tt').tree('remove', node.target);
					}else{
						alert('操作失败！');
					}
				}
			});
	}
	</script>
  </head>
  
  <body >
	<div id="cc" style="width:100%;height:750px;">
		<div data-options="region:'west'" style="width:250px;">
			<fieldset>
				<legend>
					<image onclick="expandAll()" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/control_add.png" title="展开"/>
					<image onclick="collapseAll()" style="cursor:pointer" src="../jslib/jquery-easyui-1.4.1/themes/icons/control_remove.png" title="合并"/>
				</legend>
					<ul id="tt" class="easyui-tree" data-options="
					url:'${pageContext.request.contextPath}/menu!queryMenuTreeExec.action',
					animate:true,
					lines:true,
					dnd:true,
					onDrop:onDrop,
					onClick:clickrow,
					onContextMenu: function(e,node){
						e.preventDefault();
						$(this).tree('select',node.target);
						$('#mm').menu('show',{
							left: e.pageX,
							top: e.pageY
						});
					},
					onLoadSuccess:onLoadSuccess"></ul>
			</fieldset>
		</div>
		<div data-options="region:'center'" style="padding:5px">
			 <table id="button" title="按钮管理"  class="easyui-datagrid" style="width:100%;height:770px"
					data-options="rownumbers:true,singleSelect:true,pagination:true,
					pageSize : 10,
		            pageList : [ 10, 15, 20 ],
					url:'',toolbar:toolbar1">
				<thead>
					<tr> 
						<th data-options="field:'buttonId',width:80" hidden="true">按钮Id</th>
						<th data-options="field:'buttonKey',width:150">按钮ID</th>
						<th data-options="field:'buttonName',width:150,align:'left'">按钮名称</th>
						<th data-options="field:'requestUrl',width:300,align:'right'">请求路径</th>
						<th data-options="field:'action',align:'center',formatter:rowformaterbutton">操作</th>
					</tr>
				</thead>
			</table>
		</div>
	</div>
	<div id="mm" class="easyui-menu" style="width:100px;">
		<div onclick="append()" data-options="iconCls:'icon-add'">添加</div>
		<div onclick="updateit()" data-options="iconCls:'icon-edit'">修改</div>
		<div onclick="removeit()" data-options="iconCls:'icon-remove'">删除</div>
		<div class="menu-sep"></div>
		<div onclick="expand()" data-options="iconCls:'icon-arrow-out'">展开</div>
		<div onclick="collapse()" data-options="iconCls:'icon-arrow-in'">合并</div>
	</div>
	<div id="add"  class="easyui-dialog" title="添加模块" style="width:80%;height:300px;max-width:600px;padding:10px;margin-top: 20px;" data-options="
			iconCls:'icon-save',modal:true,
			onResize:function(){
				$(this).dialog('center');
			}">
		 <div class="easyui-panel" title="" style="width:100%">
		<div style="padding:10px 10px 10px 10px">
	    <form id="ff" method="post" >
	    <input type="hidden" name="flag" id="flag"></input>
	    <input type="hidden" name="id" id="id"></input>
	    <input type="hidden" name="fatherModuleId" id="fatherModuleId"></input>
	    	<table cellpadding="5">
	    		<tr>
	    			<td>模块名称:</td>
	    			<td><input class="easyui-textbox" style="width: 300px" type="text" name="menuname" data-options="required:true"></input></td>
	    		</tr>
	    		<tr>
	    			<td>链接路径:</td>
	    			<td><input class="easyui-textbox" style="width: 300px" type="text" name="url" ></input></td>
	    		</tr> 
	    		<tr>
	    			<td>模块描述:</td>
	    			<td><input class="easyui-textbox" name="menudesc" data-options="multiline:true" style="height:60px;width: 300px"></input></td>
	    		</tr> 
	    	</table>
	    </form>
	     <div id="btndiv" style="text-align:center;padding:5px">
	    	<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">&nbsp;&nbsp;保存&nbsp;&nbsp; </a>
	    </div>
	    </div>
	</div>
	</div>
	<div id="addbutton"  class="easyui-dialog" title="添加按钮" style="width:60%;height:300px;max-width:800px;padding:10px;" data-options="
			iconCls:'icon-save',modal:true,
			onResize:function(){
				$(this).dialog('center');
			}">
		 <div class="easyui-panel" title="" style="width:100%">
		<div style="padding:10px 10px 10px 10px">
	    <form id="ffbutton" method="post" >
	    <input type="hidden" name="flagbutton" id="flagbutton"></input>
	    <input type="hidden" name="idbutton" id="idbutton"></input>
	    <input type="hidden" name="menuId" id="menuId"></input>
	    	<table cellpadding="5">
	    		<tr>
	    			<td>按钮ID:</td>
	    			<td><input class="easyui-textbox" style="width: 300px" type="text" name="buttonKey" data-options="required:true"></input></td>
	    		</tr>
	    		<tr>
	    			<td>按钮名称:</td>
	    			<td><input class="easyui-textbox" style="width: 300px" type="text" name="buttonName" data-options=""></input></td>
	    		</tr> 
	    		<tr>
	    			<td>链接路径:</td>
	    			<td><input class="easyui-textbox" style="width: 300px" type="text" name="requestUrl" ></input></td>
	    		</tr>  
	    	</table>
	    </form>
	     <div id="btndiv" style="text-align:center;padding:5px">
	    	<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitFormButton()">&nbsp;&nbsp;保存&nbsp;&nbsp; </a>
	    </div>
	    </div>
	</div>
	</div>
	<script type="text/javascript">
	var toolbar1 = [{
		text:'添加',
		iconCls:'icon-add',
		handler:function(){
			var t = $('#tt');
			var node = t.tree('getSelected');
			if (node){
				$('#menuId').val(node.id);//设置是添加
			}else{
				alert("请先选择左侧菜单");
				return false;
			}
			$('#flagbutton').val('1');//设置是添加
			$("#btndivbutton").show();
			$('#addbutton').dialog('open');
		}
	}];
	function showDetailButton(buttonId){
		$('#flagbutton').val('2');//设置是修改
		$("#btndivbutton").show();
		$('#addbutton').dialog('open');
		$('#ffbutton').form('load', '${pageContext.request.contextPath}/menu!gotoButtonUpdate.action?buttonId='+buttonId+'&temp='+Math.round(Math.random()*10000));
	}
	function deleteModuleButton(buttonId){
		if(!confirm("是否确认删除 ？")){
		   return false;
		}
		var params = {  
			"buttonId": buttonId
		};  
		var actionUrl = "${pageContext.request.contextPath}/menu!deleteButton.action";  
	    $.ajax({  
	        url : actionUrl,  
	        type : "post", 
	        data : params,  
	        dataType : "json",  
	        cache : false,  
			error : function(textStatus, errorThrown) {  
				alert("系统ajax交互错误: " + textStatus.value);  
			},  
			success : function(data, textStatus) {  
				if(data.result=='success'){
					alert('删除成功！');
					var t = $('#tt');
					var node = t.tree('getSelected');
					gridRefreshButton(node.id);
				}else{
					alert('删除失败！');
				}
			}
		});
	}
	function submitFormButton(){
		var flag = $('#flagbutton').val();
		var url = "";
		if(flag == 1){
			url = '${pageContext.request.contextPath}/menu!saveButton.action';
		}else if(flag==2){
			url = '${pageContext.request.contextPath}/menu!editButton.action';
		}
		$('#ffbutton').form('submit',{
			onSubmit:function(){
				return $(this).form('enableValidation').form('validate');
			},
			url : url,
	        dataType : 'text',
	        success : function(result) { 
	        	var data = $.parseJSON(result); 
	        	if(data.result=='success'){
	        		alert("保存成功！");
	        		 $('#addbutton').dialog('close');  
	        		 var t = $('#tt');
					 var node = t.tree('getSelected');
	        		 gridRefreshButton(node.id);
	        	}else if(data.result=='error'){
	        		alert("保存失败！");
	        	}
	        }  
		});
	}
		$(function(){
			$('#cc').layout();
			setHeight();
			var pager = $('#button').datagrid().datagrid('getPager');	// get the pager of datagrid
            //初始化关闭dialog  
           $('#add').dialog('close');  
           $('#addbutton').dialog('close');  
		}); 
		function setHeight(){
			var c = $('#cc');
			var p = c.layout('panel','west');	// get the center panel
			var oldHeight = p.panel('panel').outerHeight();
			p.panel('resize', {height:'auto'});
			var newHeight = p.panel('panel').outerHeight();
			c.layout('resize',{
				height: (c.height() + newHeight)
			});
		}
	</script>
 
  </body>
</html>
